<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" lang="en">
<head>
    <meta charset="UTF-8">
    <title>详情</title>
    <link th:include="fragment/import :: import">
    <link rel="stylesheet" th:href="@{/static/css/main.css}">
</head>
<body style="background-color: white;">
<div th:replace="fragment/common :: header"></div>
<div class="xianyan-content container">
    <div class="row my-article-detail">
        <div class="col-lg-1 col-md-0 col-sm-0 "></div>
        <div class="col-lg-10 col-md-12 col-sm-12 my-col-article">
            <div class="xianyan-content-main">
                <!--定位按钮-->
                <span class="glyphicon glyphicon-refresh" id="my-btn"></span>
                <!--中间部分-->
                <div class="xianyan-content-left">
                    <!--左边-->
                    <div class="xianyan-article-detail">
                        <div class="article-detail-title">
                            <!--文章标题-->
                            养一只自来狗是什么体验
                        </div>
                        <div class="article-detail-other">
                            <ul>
                                <li>2016.05.09 <span>19:21:21</span></li>
                                <li>点赞 <span>199</span></li>
                                <li>阅读 <span>90000</span></li>
                            </ul>
                        </div>
                        <div class="article-detail-content">
                            我从来没养过狗，这是第一次养狗。跟旺旺的相遇，似乎就像这句话说的一样。来得很突然，来得很奇妙。想起第一次相遇的时候，很奇妙的感觉。那是一个心血来潮的晚上，我和朋友跑去利和广场看电影《捉妖"
                        </div>
                        <div class="article-detail-content-footer">
                            <div class="row">
                                <div class="col-lg-4 col-md-4 col-sm-0"></div>
                                <div class="col-lg-4 col-md-4 col-sm-0"></div>
                                <div class="col-lg-4 col-md-4 col-sm-12">
                                    <div class="article-content-like img-responsive">
                                        <img class="img-responsive" th:src="@{/static/images/xyIndex/like.png}" alt="">
                                        <span>111</span>
                                    </div>
                                    <div class="article-content-unlike img-responsive">
                                        <img class="img-responsive" th:src="@{/static/images/xyIndex/unlike.png}" alt="">
                                        <span>111</span>
                                    </div>
                                    <div class="clear"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!--评论-->
                    <div class="article-detail-take-item">
                        <div class="article-detail-take-title">
                            评论
                        </div>
                        <div class="article-detail-take-input">
                            <form action="">
                                <!--评论框-->
                                <textarea name="take_content" class="form-control" rows="2" placeholder="想对作者说什么"></textarea>
                                <button type="button" class="btn btn-default btn-sm">重置</button>
                                <button type="button" class="btn btn-warning btn-sm">发表评论</button>
                            </form>
                        </div>
                        <div class="article-detail-take-content">
                            <div class="article-detail-take-writer">
                                <div class="article-detail-take-writer-img">
                                    <img class="img-circle img-responsive" th:src="@{/static/images/xyIndex/head.png}" alt="">
                                </div>
                                <div class="article-detail-take-detail">
                                    <div class="article-detail-take-writer-name">寂寞大老黑</div>
                                    <div class="article-detail-take-text">你外公是真的牛逼</div>
                                </div>
                                <div class="clear"></div>
                            </div>
                            <div class="article-detail-take-information">
                                <div class="row">
                                    <div class="col-lg-5 col-md-5 col-sm-6 col-xs-6 my-col-sm-6">
                                        <span class="article-detail-time">
                                            2016.02.09 18:21:13
                                        </span>
                                    </div>
                                    <div class="col-lg-3 col-md-3 col-sm-0 col-xs-0"></div>
                                    <div class="col-lg-4 col-md-4 col-sm-6 col-xs-6">
                                        <div class="article-detail-take-return" onclick="showTake()">
                                            回复
                                        </div>
                                        <div class="article-detail-take-like">
                                            <img class="img-responsive" th:src="@{/static/images/xyIndex/like.png}" alt="">
                                            <span>111</span>
                                        </div>
                                        <div class="clear"></div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-lg-12 col-md-12 col-sm-12">
                                        <div class="article-detail-take-input" id="article-detail-return">
                                            <form action="">
                                                <!--评论框-->
                                                <textarea name="take_content" class="form-control" rows="2" placeholder="想对作者说什么"></textarea>
                                                <button type="button" class="btn btn-default btn-sm">重置</button>
                                                <button type="button" class="btn btn-warning btn-sm">发表评论</button>
                                            </form>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="article-take-return-item">
                                <!--回复列表-->
                                <div class="article-take-return-main">
                                    <div class="article-take-return-main-content">
                                        <span class="article-detail-take-writer-name">
                                            寂寞大老黑
                                        </span>
                                        <span>:</span>
                                        <span class="article-detail-take-writer-text">你外公真的很牛逼！！！！！！！</span>
                                    </div>
                                    <div class="article-take-return-main-information">
                                        <div class="row">
                                            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-6 my-col-sm-6">
                                                <span class="article-detail-take-return-time">
                                                    2016.02.09 18:21:13
                                                </span>
                                            </div>
                                            <div class="col-lg-3 col-md-3 col-sm-0"></div>
                                            <div class="col-lg-5 col-md-5 col-sm-6 col-xs-6">
                                                <div class="article-detail-take-return">
                                                    回复
                                                </div>
                                                <div class="article-detail-take-like">
                                                    <img class="img-responsive" th:src="@{/static/images/xyIndex/like.png}" alt="">
                                                    <span>111</span>
                                                </div>
                                                <div class="clear"></div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="article-take-return-main">
                                    <div class="article-take-return-main-content">
                                        <span class="article-detail-take-writer-name">
                                            寂寞大老黑
                                        </span>
                                        <span>:</span>
                                        <span class="article-detail-take-writer-text">你外公真的很牛逼！！！！！！！</span>
                                    </div>
                                    <div class="article-take-return-main-information">
                                        <div class="row">
                                            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-6 my-col-sm-6">
                                                <span class="article-detail-take-return-time">
                                                    2016.02.09 18:21:13
                                                </span>
                                            </div>
                                            <div class="col-lg-3 col-md-3 col-sm-0"></div>
                                            <div class="col-lg-5 col-md-5 col-sm-6 col-xs-6">
                                                <div class="article-detail-take-return">
                                                    回复
                                                </div>
                                                <div class="article-detail-take-like">
                                                    <img class="img-responsive" th:src="@{/static/images/xyIndex/like.png}" alt="">
                                                    <span>111</span>
                                                </div>
                                                <div class="clear"></div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <hr>
                    </div>
                    <!--精彩推荐-->
                    <div class="article-detail-take-item">
                        <div class="article-detail-take-title">
                            精彩推荐
                        </div>
                        <div class="article-detail-recommend">
                            <div class="article-detail-recommend-title">
                                <a href="#">
                                    认真去写，总会有回报
                                </a>
                            </div>
                            <div class="article-detail-recommend-abstract">
                                我们还有从纽约街头到威尼托大街带来的有关选举的新闻摘要。我们还有从纽约街头到威尼托大街带来的有关选举的新闻摘要我们还有从纽约街头到威尼托大街带来的有关选举的新闻摘要
                            </div>
                            <div class="article-detail-recommend-writer">
                                <div class="article-detail-recommend-head">
                                    <img class="img-circle img-responsive" th:src="@{/static/images/xyIndex/head.png}" alt="">
                                </div>
                                <div class="article-detail-recommend-writer-name">
                                    <a href="#">寂寞大老虎</a>
                                </div>
                                <div class="clear"></div>
                            </div>
                        </div>
                        <div class="article-detail-recommend">
                            <div class="article-detail-recommend-title">
                                <a href="#">
                                    认真去写，总会有回报
                                </a>
                            </div>
                            <div class="article-detail-recommend-abstract">
                                我们还有从纽约街头到威尼托大街带来的有关选举的新闻摘要。我们还有从纽约街头到威尼托大街带来的有关选举的新闻摘要我们还有从纽约街头到威尼托大街带来的有关选举的新闻摘要
                            </div>
                            <div class="article-detail-recommend-writer">
                                <div class="article-detail-recommend-head">
                                    <img class="img-circle img-responsive" th:src="@{/static/images/xyIndex/head.png}" alt="">
                                </div>
                                <div class="article-detail-recommend-writer-name">
                                    <a href="#">寂寞大老虎</a>
                                </div>
                                <div class="clear"></div>
                            </div>
                        </div>
                    </div>

                </div>
                <div class="xianyan-content-right">
                    <!--右边信息-->
                    <div class="article-writer-detail">
                        <div class="article-writer-detail-inf">
                            <div class="article-detail-writer-head">
                                <img class="img-circle img-responsive" th:src="@{/static/images/xyIndex/head.png}" alt="">
                            </div>
                            <div class="article-detail-writer-name">
                                寂寞大佬黑
                            </div>
                            <div class="article-detail-writer-fouce">
                                关注
                            </div>
                        </div>
                        <div class="article-writer-article-list">
                            <div class="article-detail-take-title">
                                最新文章
                            </div>
                            <hr>
                            <div class="article-writer-article-list-content">
                                <div class="article-writer-article-list-title">
                                    <a href="#">
                                        我们还有从纽约街头到威尼托大街带来的有关选举的新闻摘要。
                                    </a>
                                </div>
                                <div class="article-writer-article-list-read-no">
                                    阅读数 222
                                </div>
                            </div>
                            <div class="article-writer-article-list-content">
                                <div class="article-writer-article-list-title">
                                    <a href="#">
                                        认真去写，总有回报
                                    </a>
                                </div>
                                <div class="article-writer-article-list-read-no">
                                    阅读数 222
                                </div>
                            </div>
                            <div class="article-writer-article-list-content">
                                <div class="article-writer-article-list-title">
                                    <a href="#">
                                        我们还有从纽约街头到威尼托大街带来的有关选举的新闻摘要。
                                    </a>
                                </div>
                                <div class="article-writer-article-list-read-no">
                                    阅读数 222
                                </div>
                            </div>
                            <div class="article-writer-article-list-content">
                                <div class="article-writer-article-list-title">
                                    <a href="#">
                                        认真去写，总有回报
                                    </a>
                                </div>
                                <div class="article-writer-article-list-read-no">
                                    阅读数 222
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="clear"></div>
            </div>
        </div>
        <div class="col-lg-1 col-md-0 col-sm-0 "></div>
    </div>
</div>
<div th:replace="fragment/common :: footer"></div>
</body>
<script type="text/javascript">
    function showTake() {
        $("#article-detail-return").slideToggle("slow");
    }
</script>
<script>
    layui.config({
        base: '../../static/js/'
    }).extend({ //设定模块别名
        project: 'project' //如果 mymod.js 是在根目录，也可以不用设定别名
    }).use('project');

</script>
</html>